<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>游戏设置 - 益智小游戏网站</title>
    <link rel="stylesheet" href="../css/styles.css">
</head>
<body>
    <header>
        <div class="container">
            <h1>益智小游戏合集</h1>
            <nav>
                <ul>
                    <li><a href="../index.html">首页</a></li>
                    <li><a href="snake.html">贪吃蛇</a></li>
                    <li><a href="tetris.html">俄罗斯方块</a></li>
                    <li><a href="memory.html">记忆翻牌</a></li>
                    <li><a href="settings.html">游戏设置</a></li>
                </ul>
            </nav>
        </div>
    </header>

    <main>
        <div class="container">
            <div class="settings-container">
                <h2>游戏设置</h2>
                
                <form id="settingsForm" class="settings-form">
                    <div class="form-group">
                        <label for="gameDuration">游戏时长（秒）</label>
                        <input 
                            type="range" 
                            id="gameDuration" 
                            name="gameDuration" 
                            min="30" 
                            max="300" 
                            step="10"
                        >
                        <p>当前设置: <span id="durationValue">60</span> 秒</p>
                    </div>

                    <div class="form-group">
                        <label for="difficulty">游戏难度</label>
                        <select id="difficulty" name="difficulty">
                            <option value="easy">简单</option>
                            <option value="medium">中等</option>
                            <option value="hard">困难</option>
                        </select>
                    </div>

                    <div class="form-group">
                        <label for="soundEnabled">
                            <input 
                                type="checkbox" 
                                id="soundEnabled" 
                                name="soundEnabled" 
                                checked
                            >
                            启用音效
                        </label>
                    </div>

                    <button type="submit" class="btn">保存设置</button>
                    <button type="button" id="resetDefaultsBtn" class="btn">恢复默认设置</button>
                </form>

                <div class="game-instructions">
                    <h3>设置说明</h3>
                    <ul>
                        <li>游戏时长：设置每种游戏的时间限制，设为0表示无时间限制</li>
                        <li>游戏难度：调整游戏的难度级别，影响游戏速度和得分倍率</li>
                        <li>音效设置：开启或关闭游戏中的音效</li>
                        <li>设置将保存在您的浏览器中，下次访问时仍然有效</li>
                    </ul>
                </div>
            </div>
        </div>
    </main>

    <footer>
        <div class="container">
            <p>&copy; 2024 益智小游戏网站. 保留所有权利.</p>
        </div>
    </footer>

    <script src="../js/main.js"></script>
    <script src="../js/settings.js"></script>
</body>
</html>